<template>
	<view class="box">
		<view class="headerView">
			<image v-if="!noleftIcon" class="leftIcon" src="/static/images/left.png" mode="heightFix" @click="back"></image>
			<view v-if="noleftIcon" class="leftIcon"></view>
			<view class="centent">
				{{ title }}
			</view>
			<!-- <image class="rightIcon" :src="rightIcon" mode="heightFix" @click="rightClick"></image> -->
			<view class="rightview">
				<slot></slot>
			</view>
		</view>
	</view>
</template>

<script>
	import { string } from 'mathjs';
	export default {
		name: 'headerView',
		props: {
			noleftIcon: {
				type: Boolean,
				default: false,
			},
			title: '',
		},
		data() {
			return {};
		},
		methods: {
			rightClick() {
				this.$emit('rightClick');
			},
		},
	};
</script>
<style lang="scss" scoped>
	.box {
		height: 80rpx;
		position: sticky;
		z-index: 9;
	}
	.headerView {
		width: $connet-width;
		padding: 0 30rpx;
		height: 80rpx;
		background: #fff;
		position: fixed;
		top: 0;
		left: 0;
		z-index: 9;
		display: flex;
		justify-content: space-between;
		align-items: center;

		.centent {
			position: absolute;
			width: 100%;
			text-align: center;
			z-index: 1;
		}
		.rightview {
			position: relative;
			z-index: 2;
		}
		.leftIcon,
		.rightIcon {
			position: relative;
			z-index: 2;
			width: 16rpx;
			height: 45rpx;
		}
	}
</style>
